import React, { Component } from 'react';
import { Route,Redirect } from 'react-router-dom'


import { Home } from './Home'
import { News } from './News'
import { Search } from './Search'
import { My } from './My'
import { MyTabBar } from '../../components/MyTabBar'

import './main.css'

export class Main extends Component {

    state = {
        tabBar: [
            { icon: 'ind', title: '首页', path: '/main', component: Home },
            { icon: 'findHouse', title: '找房', path: '/main/houses', component: Search },
            { icon: 'infom', title: '资讯', path: '/main/news', component: News },
            { icon: 'my', title: '我的', path: '/main/my', component: My },
        ]
    }

    render() {
        return (
            <div>
                {/* 非TabBar */}
                <Route path="/main" exact component={Home}></Route>
                <Route path="/main/news" component={News}></Route>
                <Route path="/main/houses" component={Search}></Route>
                <Route path="/main/my" component={My}></Route>
                {/* TabBar */}
                <MyTabBar tabBar={this.state.tabBar} {...this.props}/>
            </div>

        )
    }
}